<template>
  
  <div class="application" ref="body">
    <headTop></headTop>
    <div class="search">
        <div class="search_div">搜索</div>
        <div class="down">
          <div class="iconfont icon-xiazai downicon"></div>  
          <div>下载</div>
        </div> 
    </div>

    <div class="list">
      <div class="title">
        <div class="user">分享人列表(52)</div>
        <div class="apply">报名</div>
        <div class="entrance">入场</div>
        <div class="sign">签到</div>   
        <div class="arrow">
          
        </div>  
      </div>
      <div class="content">
         <ul>

           <li> 
              <div class="user">
                <div class="avatar">
                  <img src="~src/images/aimer.jpg" alt="">
                </div>
                <div class="name">哎，你的益达</div>
              </div>
              <div class="apply">
                123
              </div>
              <div class="entrance ">
                444
              </div>
               <div class="entrance ">
                1111
              </div>
               <div class="arrow iconfont icon-jiantou-copy"></div>  
            </li>
           
            
         </ul> 
      </div>
    </div>  
    <div class="bottom">
       付费查看更多
    </div>
  </div> 
</template>

<script>
   import headTop from 'src/components/action_btn/action_btn'
   import { GetInvitationAbility_api } from 'src/servise/getData'; // 能力邀约
      export default {
          data() {
            return {

            }
          },
          created () {
              //能力邀约初始化
              this.init();
          },
          methods: {
            init() {
              this.$http.get(GetInvitationAbility_api, {
                params: {
                  actId: sessionStorage._ActivityID
                }
                }).then((res) => {
                  console.log(GetInvitationAbility_api+"?actId="+sessionStorage._ActivityID);
                  console.log(res);
              });
            }
          },
         components: {
            headTop,
            
        },

        beforeCreate(){
             document.querySelector('body').setAttribute('style', 'background:#fff')
        },
         beforeDestroy () {
    document.querySelector('body').setAttribute('style', '')
  }
      }
</script>
<style lang="stylus" scoped>
html{-webkit-text-size-adjust:none;}
 @import './icon/iconfont.css';
   .search
      display flex
      flex-flow row
      padding 5px 15px
      padding-right 0
     .search_div
        height 30px
        flex 1
        background-color #F0F0F0
        font-size 14px
        line-height 28px
        text-align center
        color #AEAEAE
        margin-top 1px
     .down
        height 28px
        width 35px
        .downicon
          font-size: 14px;
        div
          font-size 12px
          text-align: center;
          color #666
            
    .list
      margin-top 14px
      
   .title
      display flex
      padding: 8px 15px;
      font-size 12px
      color #666666 !important
      border-bottom 1px solid #E5E5E5
      
      div
        text-align center
      .user
        flex 4
        font-size 15px
        color #333333
        text-align left 
      .apply
        flex 1
        color #666666
      .changge
        font-size 16px
        flex 1
        color #666666
      .entrance
        font-size 16px
        flex 1
        color #666666
      .sign
        font-size 16px
        flex 1
        color #666666
      .arrow
        font-size 16px
        width 20px
       
    .content
       li
        display flex
        border-bottom 1px solid #E5E5E5
        height 50px
        align-items:center;
        justify-content:center;
        padding: 0px 15px;

      
       
        div
          display inline-block
          text-align center
          display flex
          align-items:center;
          justify-content:center;
          
          span
            display inline-block
            width 16px
            height 16px 
          .icon
            background-color #00C9C2
            border-radius 10px 
        .arrow
          width 20px 
          color: #999999;
          font-size: 18px;
          padding-top: 1px;
          padding-left: 2px;
        .user
          flex 4
          display flex
          justify-content flex-start
         
          color #333333
         
          .avatar
            width 30px
            height 30px
          
            img
              width 100%
          .name   
            font-size 16px
            margin-left: 10px;

    
      .apply
        flex 1
        color #666666
        font-size 14px
      .changge
        flex 1
        color #666666
        font-size 14px
      .entrance
        flex 1
        color #666666
        font-size 14px
      .sign
        flex 1
        color #666666  
        font-size 14px   
    .bottom
      height 50px
      width 100%
      position fixed
      bottom 0px
      font-size 14px
      color #EF5B49
      line-height 50px
      text-align center
  .icon-gougou{
    color #00c9c2
  }
</style>

